<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <table id="demo" lay-filter="test"></table>
        </div>
    </div>
</div>
<script>
    debugger;
    layui.use('tableX', function(){

        var table = layui.table;
        var tableX = layui.tableX;

        //第一个实例
        var tableIns = tableX.render({
            elem: '#demo'
            ,url: 'json/test.json' //数据接口
            ,page: {theme: '#c00'} //开启分页
            ,totalRow: true //统计行
            ,toolbar: 'default'
            ,size: 'lg'
            ,even: true
            ,where: {
                ccc: 'unknow',
                bbb: 'zzz'
            }
            ,text: {
                none: '暂无相关数据' //默认：无数据。
            }
            ,defaultToolbar: ['filter', 'print', 'exports', {
                title: '提示' //标题
                ,layEvent: 'LAYTABLE_TIPS' //事件名，用于 toolbar 事件中使用
                ,icon: 'layui-icon-tips' //图标类名
            }]
            ,cols: [[ //表头
                {field: 'id', title: 'ID', width:80, sort: true, type:'checkbox', LAY_CHECKED: true, fixed: 'left', totalRowText: '合计'}
                ,{field: 'username', title: '用户名', width:80, edit: 'text'}
                ,{field: 'sex', title: '性别', width:80, sort: true}
                ,{field: 'city', title: '城市', width:80, event: 'testEvent', style: 'background-color: #5FB878; color: #fff;'}
                ,{field: 'sign', title: '签名', width: 177, unresize: true, align: 'right'}
                ,{field: 'experience', title: '积分', width: 80, sort: true}
                ,{field: 'score', title: '评分', width: 80, sort: true, totalRow: true}
                ,{field: 'classify', title: '职业', width: 80}
                ,{field: 'wealth', title: '财富', width: 135, sort: true}
            ]]
            ,done: function() {
                tableX.merges('demo', [2]);  // 合并第2列相同的单元格
            }
        });

        table.on('tool(test)', function(obj) {
            console.log(obj);
        });

        tableIns.reload({
            where: { //设定异步数据接口的额外参数，任意设
                aaaaaa: 'xxx'
                ,bbb: 'yyy'
            }
            ,page: {
                curr: 1 //重新从第 1 页开始
            }
        },false);
    });
</script>